<!DOCTYPE html>
<html lang="en">
<head>
    <!-- 删除元素 -->
    <ol>
        <li>List item 1</li>
        <li>List item 2</li>
        <li>List item 3</li>
    </ol>
    <!-- 添加元素 -->
    <!-- <ol>
        <li>List item 1</li>
        <li>List item 2</li>
        <li>List item 3</li>
    </ol> -->
    <!-- CSS属性操作 -->
     <!-- <div style="font-size: 36px;">我是⼀个⽂本</div> -->
    <!-- 元素属性操作 -->
    <!-- <p><a href="https://www.bitejiuyeke.com/index" id="bite">⽐特就业课</a></p> -->
    <!-- 元素操作 -->
    <!-- <button type = "button">点我有惊喜</button>
    <div id= "text" >我是一个div</div>
    <div id= "text2" ><span>我是一个div</span></div>
    <input type = "text" value = "hello"> -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.6.0.min.js"> </script> -->
   <script src="JS/jquery-3.7.1.js"></script>
   <script>
    //删除元素
    // $("ol").remove();//删除所有标签
    $("ol").empty();//删除子标签，不删除标签
    // 添加元素
    // $(function () {
    //     $("ol").append("<li>append</li>");
    //     $("ol").prepend("<li>prepend</li>");
    
    //     $("ol").before("ol前插⼊");
    //     $("ol").after("ol后插⼊");
    // });
    //获取/返回CSS属性
    //     $(document).ready(function(){
    //     let size = $("div").css("font-size","48px");
    //     console.log(size);
    // });
    // $(document).ready(function(){
    //     let size = $("div").css("font-size");
    //     console.log(size);
    // });
    // 设置/返回元素属性
    // $(document).ready(function(){
    //     let attr = $("p a").attr("href","www.com.baidu");
    //     console.log($("p a").attr("href"));
    // });
    // $(document).ready(function(){
    //     let attr = $("p a").attr("href");
    //     console.log(attr);
    // });
    //设置/返回元素内容
    //     $(document).ready(function(){
    //     $('button').click(function(){
    //         $(document).ready(function(){
    //             let text = $("#text").text("<h1>我变了，我是text</h1>");
    //             console.log("text内容为：" + text);

    //             let html = $("#text").html("<h1>我变了，我是html</h1>");
    //             console.log("html内容为：" + html);

    //             let val = $("input").val("我变了，我是input");
    //             console.log("val内容为：" + val);
    //         });
    //     });
    // });
    // $(document).ready(function(){
    //     let text = $("#text").text();
    //     console.log("text内容为：" + text);

    //     let html = $("#text").html();
    //     console.log("html内容为：" + html);

    //     let val = $("input").val();
    //     console.log("val内容为：" + val);
        
    // });
    //例子
    // $(document).ready(function(){
    //     $('button').click(function() {
    //         $(this).hide();
    //     });
    // });
   </script>
</body>
</html>